<template>
	<view class="container">
		<view class="headinfo">
			<view class="head_left">
				<view class="headname">
					<image src="/static/images/main/ico_avatar.png" alt="">
					<text>{{ userinfo.nickName || 'xxx' }}</text>
				</view>
				<view class="headunit">
					<view>单位：{{ userinfo.dept ? userinfo.dept.leader : '泊于水库管理所' }}</view>
				</view>
				<view class="headphone">
					<view>联系方式：{{ userinfo.phonenumber || '' }}</view>
				</view>
			</view>
			<view class="head_right">
				<!-- <view class="head_right_box">
					<view>离线上传：</view>
					<view>6</view>
				</view> -->
			</view>
		</view>
		<view class="tab boxshow">
			<div class="tab_box">
				<view @click="profile" class="tab_box_list">
					<image src="/static/images/main/img_tab1.png" alt="">
					<view>个人信息</view>
				</view>
				<view @click="modify" class="tab_box_list">
					<image src="/static/images/main/img_tab2.png" alt="">
					<view>修改密码</view>
				</view>
				<view @click="feedback" class="tab_box_list">
					<image src="/static/images/main/img_tab3.png" alt="">
					<view>意见反馈</view>
				</view>
			</div>
		</view>
		<view class="menu boxshow">
			<view @click="checkVersion" class="menu_list">
				<view>版本检测（当前v{{ version }}）</view>
			</view>
			<view @click="showDeviceinfo" class="menu_list">
				<view>设备信息</view>
			</view>
			<view @click="showQRcode" class="menu_list">
				<view>二维码分享</view>
			</view>
			<view @click="clear" class="menu_list">
				<view>清理缓存</view>
			</view>
		</view>
		<view @click="tologout" class="exit boxshow">
			<view>退出登录</view>
		</view>

		<uni-popup ref="popup" background-color="#fff">
			<view class="popup-content">
				<view>手机品牌：{{ deviceInfo.brand }}</view>
				<view>手机型号：{{ deviceInfo.deviceModel }}</view>
				<view>Android版本：{{ deviceInfo.system }}</view>
				<view>app版本：{{ version }}</view>
				<view>当前时间：{{ ndate }}</view>
			</view>
		</uni-popup>

		<uni-popup ref="qrcode" background-color="#fff">
			<view class="qrcode_content">
				<image src="../../pagesA/static/qrcode.png" mode="" />
			</view>
		</uni-popup>
	</view>
</template>

<script>
	import { getAppVersion } from "@/utlis/updataApp.js"
	import dayjs from '@/utlis/dayjs.min';

	export default {
		data() {
			return {
				version: '',
				deviceInfo: {},
				ndate: '',
				userinfo: {}
			}
		},
		onLoad() {
			this.version = plus.runtime.version
		},
		onShow() {
			this.getUserinfo()
		},
		methods: {
			// 个人信息
			profile() {
				uni.navigateTo({ url: '/pagesA/profile/index' })
			},
			// 修改密码
			modify() {
				uni.navigateTo({ url: '/pagesA/modify/index' })
			},
			// 意见反馈
			feedback() {
				uni.navigateTo({ url: '/pagesA/feedback/index' })
			},
			// 获取个人信息
			getUserinfo() {
				this.$request.getuserprofile().then(res => {
					this.userinfo = res.data || {}
				})
			},
			// 检测版本
			checkVersion() {
				this.$request.getVersion().then(res => {
					let newversion = res.rows[0].versionNumber
					if(newversion > plus.runtime.version) {
						getAppVersion(true, newversion, 'http://whswszls1.weihai.cn/statics/app/poyu.apk')
					} else {
						uni.showToast({
							title: '当前已是最新版本，无需更新',
							icon: 'none',
							duration: 2000
						});
					}
				})
			},
			// 设备信息
			showDeviceinfo() {
				this.deviceInfo = uni.getDeviceInfo()
				this.ndate = dayjs().format('YYYY-MM-DD HH:mm:ss')
				setTimeout(() => {
					this.$refs.popup.open('center')
				})
			},
			// 二维码
			showQRcode() {
				this.$refs.qrcode.open()
			},
			// 缓存大小
			formatSize() {
        let that = this
        plus.cache.calculate(function (size) {
          let sizeCache = parseInt(size)
          if (sizeCache == 0) {
            that.fileSizeString = "0B"
          } else if (sizeCache < 1024) {
            that.fileSizeString = sizeCache + "B"
          } else if (sizeCache < 1048576) {
            that.fileSizeString = (sizeCache / 1024).toFixed(2) + "KB"
          } else if (sizeCache < 1073741824) {
            that.fileSizeString = (sizeCache / 1048576).toFixed(2) + "MB"
          } else {
            that.fileSizeString = (sizeCache / 1073741824).toFixed(2) + "GB"
          }
        })
      },
			// 清除缓存
      clear() {
        let that = this
				// #ifdef APP-PLUS
				let main = plus.android.runtimeMainActivity()
        let sdRoot = main.getCacheDir()
        let files = plus.android.invoke(sdRoot, "listFiles")
        let len = files.length
        for (let i = 0; i < len; i++) {
          let filePath = "" + files[i] // 没有找到合适的方法获取路径，这样写可以转成文件路径
          plus.io.resolveLocalFileSystemURL(
            filePath,
            function (entry) {
              if (entry.isDirectory) {
                entry.removeRecursively(
                  function (entry) {
                    //递归删除其下的所有文件及子目录
                    uni.showToast({
                      title: "缓存清理完成",
                      duration: 2000,
                    })
                    that.formatSize() // 重新计算缓存
                  },
                  function (e) {
                    console.log(e.message)
                  }
                )
              } else {
                entry.remove()
              }
            },
            function (e) {
              console.log("文件路径读取失败")
            }
          )
        }
				// #endif
				// #ifndef APP-PLUS
				uni.showLoading({
					title: '清理中...',
				});
				setTimeout(() => {
					uni.showLoading({
						title: '清理完成',
						icon: 'success',
						duration: 2000
					});
					
				}, 2000);
				setTimeout(() => {
					uni.hideLoading();
				}, 3000)
				// #endif
      },
			// 退出登录
			tologout() {
				uni.showModal({
					title: '提示',
					content: '是否确认退出登录？',
					success: function (res) {
						if (res.confirm) {
							uni.removeStorageSync('token');
							uni.showToast({
								title: '退出成功！',
								icon: 'none',
								duration: 2000
							});
							setTimeout(() => {
								uni.reLaunch({
									url: "../login/index",
								})
							}, 2000)
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});
			},
		}
	}
</script>

<style lang="scss" scoped>
	.container {
		background-color: #f6faff;
	}

	.boxshow {
    background-color: #fff;
    border-radius: 20rpx;
    box-shadow: 0 0 10rpx rgba($color: #000, $alpha: .1);
  }

	.headinfo {
		display: flex;
		justify-content: space-between;
		color: #fff;
		background-image: url('../../static/images/main/img_headbg.jpg');
		background-size: 100% 100%;
		background-repeat: no-repeat;
		padding: 25rpx 25rpx 128rpx 72rpx;

		.head_left {
			
			.headname {
				font-size: 38rpx;
				display: flex;
				align-items: center;
				
				image {
					width: 50rpx;
					height: 50rpx;
					margin-right: 20rpx;
				}
			}

			.headunit {
				font-size: 28rpx;
				line-height: 28rpx;
				padding: 25rpx 0;
			}

			.headphone {
				font-size: 28rpx;
				line-height: 28rpx;
			}
		}

		.head_right {
			display: flex;

			.head_right_box {
				display: flex;
				align-items: center;
				height: 50rpx;
				line-height: 50rpx;

				view {
					&:nth-child(1) {
						font-size: 32rpx;
						line-height: 32rpx;
					}

					&:nth-child(2) {
						width: 35rpx;
						height: 35rpx;
						border-radius: 50%;
						background-color: #fff;
						color: #1890ff;
						display: flex;
						align-items: center;
						justify-content: center;
						font-size: 28rpx;
						font-weight: bold;
						line-height: 28rpx;
					}
				}
			}
		}
	}

	.tab {
		width: calc(100% - 50rpx);
		margin: -92rpx auto 0;
		background-color: #fff;
		border-radius: 20rpx;

		&_box {
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 15rpx 60rpx 12rpx;

			&_list {
				text-align: center;

				image {
					width: 100rpx;
					height: 100rpx;
				}

				view {
					font-size: 30rpx;
					line-height: 30rpx;
					padding-top: 14rpx;
				}
			}
		}
	}
	
	.menu {
		width: calc(100% - 50rpx);
		margin: 30rpx auto 0;
		background-color: #fff;
		border-radius: 20rpx;

		.menu_list {
			border-bottom: 1px solid #f2f1f1;
			padding: 30rpx 32rpx;
			font-size: 28rpx;
			line-height: 28rpx;
			color: #000;

			&:last-child {
				border-bottom: 0;
			}
		}
	}

	.exit {
		width: calc(100% - 50rpx);
		margin: 30rpx auto 0;
		background-color: #fff;
		border-radius: 20rpx;

		view {
			font-size: 30rpx;
			line-height: 28rpx;
			color: #000;
			padding: 30rpx 32rpx;
			text-align: center;
		}
	}

	.popup-content {
		padding: 30rpx 60rpx;

		view {
			font-size: 28rpx;
			line-height: 28rpx;
			padding: 10rpx 0;

			&:last-child {
				padding-top: 20rpx;
			}
		}
	}

	.qrcode_content {
		padding: 30rpx;

		image {
			width: 500rpx;
			height: 500rpx;
		}
	}
</style>
